﻿<html>
<head>
<title>JSFlow Branches sample</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="../html/html.js"></script>
<script type="text/javascript" src="jsflow.js"></script>
<script type="text/javascript">

function $(id){return document.getElementById(id);}

function log(msg){$("out").innerHTML+=msg+"<br>";}

with(JSFlow){
	// Процесс определяем в виде функции, возвращающей исполняемый экземпляр процесса.
	// При каждом запуске создается новый экземпляр.
	var process = function(){
		return sequence(
			function(){
				var go = new Continuation();
				var delay = 200;
				log("f1: Wait for "+ delay);
				setTimeout(function(){
					go();
				}, delay);
			},
			function(){
				var go = new Continuation();
				var delay = 500;
				log("f2: Wait for "+ delay);
				setTimeout(function(){
					go();
				}, delay);
			},
			function(){
				var go = new Continuation();
				continueExecution = go;
				$("inputPanel").style.display = "block";
				log("f3: Enter number more (for branch 2) or less (for branch 1) than 5 and press Continue Execution button");
			},
			
			function(){
				var go = new Continuation();
				var nr = parseInt($("myNumber").value);
				log("f4: "+nr+" entered");
				// Выбираем ветвь для дальнейшего исполнения
				var branch = nr>5?branch2():branch1();
				// Назначаем ветви точку возврата по исполнении. 
				// Т.е. когда ветвь выполнится, будет исполнена следующая команда данного потока.
				// Иными словами, обработчику события завершения ветви назначается продолжение (Continuation) данного потока.
				branch.onComplete = go; 
				branch.run();
				// Можно написать и проще - просто передать продолжение методу run: 
				//    branch.run(go);
				// Оба варианта эквивалентны.
			},
			
			function(){
				log("Process complete.");
			}
		);
	};
	
	// Ветви реализуем в виде функций, возвращающих экземпляр процесса.
	// Т.е. при каждом запуске процесса используется новый его экземпляр.
	var branch1 = function(){
		return sequence(
			function(){
				var go = new Continuation();
				log("branch 1 executed");
				go();
			}
		);
	};
	
	var branch2 = function(){
		return sequence(
			function(){
				var go = new Continuation();
				log("branch 2 executed");
				go();
			}
		);
	};
}


function continueExecution(){
}

function runProcess(){
	$("inputPanel").style.display = "none";
	$("out").innerHTML = "";
	
	// Создаем экземпляр процесса, и запускаем его.
	process().run();
}

</script>
</head>
<body>
	<h1>JSFlow Branches sample</h1>
	<button onclick="runProcess()">Run Process</button><br>
	<div id="inputPanel" style="display:none;">
		<input type="text" id="myNumber" value="0">
		<button onclick="continueExecution()">Continue Execution</button>
	</div>
	<div id="out">
</body>
</html>